<!--
 * @Date: 2022-04-11 17:08:45
 * @Author: 陶子
 * @LastEditTime: 2023-07-05 13:40:53
 * @FilePath: \jk_one-stop_cloud_mobile_v1.0\src\views\warehouseManagement\inventoryQuery\inventoryQueryList.vue
 * @pageName: 这是--(出入库查询)--页面
-->
<template>
  <div class="room-content">
    <Navbar :appTitle="appTitle" rtitle="..." :right="rightText" :rightShow="true" :actions='[{ text: checkedShow?"取消删除":"批量删除" }]' @clickAction='clickSelect'
      @ClickRight="ClickRight" />
    <Search style='padding-top:0.1rem' ref="topSearch" class="search" placeholder="物品编号|物品名称|库管单" :isAdd="true" :actions="newAction" :isScreen="true" :isType="true"
      @onSearch="onSearch" @onScreen="onScreen" @clickAction='clickAction'></Search>
    <search-tag ref="SearchTag" @getCategory="getCategory">
    </search-tag>
    <div class="serach-content">
      <div class="content">
        <span class="tapbtn" @click="tapChange(item)" v-for="(item, index) in tabList" :key="index" :class="{ active: item.value == active }">{{ item.name }}</span>
      </div>
    </div>
    <!--分页列表 -->
    <div class="listBox">
      <pageList :minLen="3" @handleList='handleList' @getCheckedValue="getCheckedValue" ref="pageList" :operationTxt="operationTxt" :checkedShow="checkedShow" :columns="columns"
        :listUrl="listUrl" @operationItem='operationItem' />
    </div>
    <!-- dialog弹框 -->
    <van-dialog v-model="showDialog" show-cancel-button confirm-button-color="#1890FF" confirmButtonText='确定' cancelButtonText='取消' @confirm='dialogConfirm'>
      <div slot="title" class="dialogContentBox">
        <van-icon name="question-o" size="0.20rem" color="#FF943E" /><span style="margin-left: 0.07rem">确定删除吗？</span>
      </div>
      <div style="margin: 0.1rem 0.46rem 0.3rem 0.46rem; color: #888888">
        删除后不可恢复
      </div>
      <div style="background: #f0f0f0; width: 100%; height: 0.01rem"></div>
    </van-dialog>
  </div>
</template>

<script>
import Search from "@/components/search";
import SearchTag from "./SearchTag";
import Navbar from "@/components/navBar/navBar_right";
import TabBar from "@/components/TabBar";
import pageList from "@/components/pageList";
import { processTaskCompletionStatics, batchDel } from "@/api/mobile";
export default {
  name: "carRoomList",
  components: { Navbar, TabBar, pageList, Search, SearchTag },
  data() {
    return {
      rightText: "批量删除",
      listUrl: "/wms/wmsWarehouseOperate/listByGoods", //列表接口
      columns: {
        titleKey: "goodsCode", //标题
        subtitleKey: "goodsName", //副标题
        content: [
          //内容
          {
            name: "出库数量",
            key: ["goodsNum","assistUnit"],
          },
          {
            name: "出库数量(F)",
            key: ["goodsNumTxtAssistUnit"],
          },
          {
            name: "出库日期",
            key: ["operateTime"],
          },
        ],
        labelKey: ["operateTaskTypeName", "orderNumber"], //标签
        operationText: "删除",
      },
      keyword: "",
      active: "2",
      tabList: [
        { name: "出库查询", value: "2" },
        { name: "入库查询", value: "1" },
      ],
      filterForm: {},
      newAction: [
        { text: "新建出库单", icon: "add-o" },
        { text: "新建入库单", icon: "add-o" },
      ],
      appTitle: "",
      checkedShow: false, //列表是否支持选择
      operationTxt: "批量删除", //选择按钮名称
      showDialog: false,
      deleteType: "aloneDelete",
      selectArr: null,
      itemInfo: {},
    };
  },
  beforeRouteLeave(to, from, next) {
    if (this.$refs.SearchTag.showSearchTag) {
      this.appTitle = this.$route.query.navTitle;
      this.$refs.SearchTag.showSearchTag = false;
      next(false);
    } else {
      next();
    }
  },
  mounted() {
    this.appTitle = this.$route.query.navTitle;
    let searchObj = {
      keyword: this.keyword,
    };
    this.searchQuery(searchObj);
  },
  methods: {
    ClickRight() {
      if (this.checkedShow) {
        this.rightText = "取消删除";
        // this.checkedShow = true;
      } else {
        this.rightText = "批量删除";
        // this.checkedShow = false;
      }
    },
    operationItem(item, type) {
      if (type == "删除") {
        this.deleteType = "aloneDelete";
        this.itemInfo = item;
        this.showDialog = true;
      }
    },
    // 获取选择的列表数据
    getCheckedValue(ids, selectArr) {
      if (selectArr.length > 0) {
        this.showDialog = true;
        this.deleteType = "batchDelete";
        this.selectArr = selectArr;
      } else {
        this.$toast("请先选择数据");
      }
    },
    clickSelect(text) {
      if (text == "批量删除") {
        this.checkedShow = true;
      } else {
        this.checkedShow = false;
      }
    },
    dialogConfirm() {
      console.log("点击了确定", this.deleteType);
      let dtoList = [];
      if (this.deleteType == "aloneDelete") {
        let aloneObj = {
          id: this.itemInfo.id,
          warehouseId: this.itemInfo.warehouseId,
        };
        dtoList.push(aloneObj);
      } else {
        for (let item of this.selectArr) {
          let itemObj = {
            id: item.id,
            warehouseId: item.warehouseId,
          };
          dtoList.push(itemObj);
        }
      }
      batchDel(dtoList).then((res) => {
        if (res.code == 200) {
          let searchObj = {
            ...this.filterForm,
            operateType: this.active,
          };
          this.searchQuery(searchObj);
          this.$toast(
            this.deleteType == "aloneDelete" ? "删除成功！" : "批量删除成功！"
          );
        } else {
          this.$toast(res.message);
        }
      });
    },
    handleList(id, row, type) {
      if (type == "列表") {
        let openUrl = "";
        let detailType = "";
        switch (row.operateTaskType) {
          case "O9": //其他出库
            openUrl = "/outAndInDetail";
            detailType = "outStock";
            break;
          case "O8": //盘亏出库
            openUrl = "/outAndInDetail";
            detailType = "outStock";
            break;
          case "O7": //调拨出库
            openUrl = "/outAndInDetail";
            detailType = "outStock";
            break;
          case "O6": //新建出库单
            openUrl = "/outAndInDetail";
            detailType = "outStock";
            break;
          case "O5": //生产补料出库
            openUrl = "/orderQueryDetail";
            detailType = "outStock";
            break;
          case "O4": //生产领料出库
            openUrl = "/orderQueryDetail";
            detailType = "outStock";
            break;
          case "O3": //销售出库
            openUrl = "/orderQueryDetail";
            detailType = "outStock";
            break;
          case "I9": //其他入库
            openUrl = "/outAndInDetail";
            detailType = "inStock";
            break;
          case "I8": //盘亏入库
            openUrl = "/outAndInDetail";
            detailType = "inStock";
            break;
          case "I7": //调拨入库
            openUrl = "/outAndInDetail";
            detailType = "inStock";
            break;
          case "I6": //新建入库
            openUrl = "/outAndInDetail";
            detailType = "inStock";
            break;
          case "I5": //报废品入库
            openUrl = "/orderQueryDetail";
            detailType = "inStock";
            break;
          case "I3": //合格品入出库
            openUrl = "/orderQueryDetail";
            detailType = "inStock";
            break;
          case "I2": //生产退料入库
            openUrl = "/orderQueryDetail";
            detailType = "inStock";
            break;
          case "I1": //采购入库
            openUrl = "/orderQueryDetail";
            detailType = "inStock";
            break;
        }
        let obj = {
          id: row.warehouseOperateId,
          detailType,
        };
        if (openUrl) {
          this.$router.push({
            path: openUrl,
            query: obj,
          });
        }
      }
    },
    tapChange(obj) {
      if (obj.name == "出库查询") {
        this.columns.content[0].name = "出库数量";
        this.columns.content[1].name = "出库数量(F)";
        this.columns.content[2].name = "出库日期";
      } else {
        this.columns.content[0].name = "入库数量";
        this.columns.content[1].name = "入库数量(F)";
        this.columns.content[2].name = "入库日期";
      }
      this.active = obj.value;
      let searchObj = {
        keyword: this.keyword,
        ...this.filterForm,
      };
      this.searchQuery(searchObj);
    },
    onSearch(v) {
      this.keyword = v;
      let searchObj = {
        ...this.filterForm,
        keyword: this.keyword,
      };
      this.searchQuery(searchObj);
    },
    onScreen() {
      this.appTitle = "更多筛选";
      this.keyword = this.$refs.topSearch.value;
      let pramsObj = JSON.parse(JSON.stringify(this.filterForm));
      pramsObj.keyword = this.keyword;
      this.$refs.SearchTag.showModal(this.keyword, pramsObj);
    },

    getCategory(sureObj) {
      this.appTitle = this.$route.query.navTitle;
      this.keyword = sureObj.keyword;
      this.$refs.topSearch.value = sureObj.keyword;
      this.filterForm = JSON.parse(JSON.stringify(sureObj));
      this.searchQuery(sureObj);
    },
    // 搜索
    searchQuery(searchObj) {
      let params = {
        ...searchObj,
        operateType: this.active,
      };
      console.log("这里有啥：", params);
      this.$refs.pageList.searchQuery(params);
    },
    clickAction(text) {
      if (text == "新建出库单") {
        this.$router.push("/buildOutStock");
      } else {
        this.$router.push("/buildInStock");
      }
    },
  },
};
</script>
<style lang="scss" scoped>
.room-content {
  height: 100vh;
  overflow-y: scroll;
  .serach {
    height: 0.33rem;
    background: #f2f2f6;
    border-radius: 0rem;
    margin-bottom: 0.16rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    line-height: 0.33rem;
    padding: 0.1rem 0.12rem;
    // border: 1px solid red;
    .placeh {
      font-size: 0.16rem;
      font-family: PingFang SC;
      font-weight: 400;
      color: #888888;
      line-height: 0.23rem;
    }
    .icon {
      width: 0.15rem;
      height: 0.16rem;
    }
  }
  .serach-content {
    // height: 1.52rem;
    background: #ffffff;
    padding: 0 0.16rem 0.16rem 0.16rem;
    .content {
      display: flex;
      .tapbtn {
        // height: 0.23rem;
        // background: #1890ff;
        background: #f2f2f6;
        border-radius: 0.02rem;
        font-size: 0.16rem;
        font-family: PingFang SC;
        font-weight: 500;
        color: #888888;
        line-height: 0.23rem;
        margin-right: 0.12rem;
        text-align: center;
        padding: 0.04rem 0.28rem;
        cursor: pointer;
      }
      .active {
        color: #ffffff;
        background: #1890ff;
      }
    }
  }
}
.listBox {
  height: calc(100vh - 1.5rem);
  overflow-y: auto;
}
.dialogContentBox {
  text-align: left;
  margin: 0.1rem 0.19rem;
  color: #191f25;
  font-size: 0.16rem;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
/deep/ .van-dropdown-menu__bar {
  box-shadow: none;
}
</style>